<!DOCTYPE html>
 <html lang="en">

 <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="description" content="">
     <meta name="author" content="">
     <link rel="icon" href="../../favicon.ico">

     <title>Signin Template for Bootstrap </title>

     <!-- Bootstrap core CSS -->
     <link href="/static/dependency/js/bootstrap-3.3.7/js/bootstrap.js" rel="stylesheet">

     <script src="/static/dependency/js/jquery-3.2.1.min.js"> </script>

 </head>

 <body>

     <div class="container">

         <form class="form-signin" action="/signUp" method="post" role="form">
             <h2 class="form-signin-heading">Please Sign Up </h2>
             <input type="email" name="username" class="form-control" placeholder="Email address" required autofocus>
             <input type="password" name="password" class="form-control" placeholder="Password" required>

             <button class="btn btn-lg btn-primary btn-block" type="button">Register </button>
         </form>

     </div>

 <script>
	 $(function() {
	     $('button').click(function() {
	         var user = $('#txtUsername').val();
	         var pass = $('#txtPassword').val();
	         $.ajax({
	             url: '/signUpUser',
		         data: $('form').serialize(),
		         type: 'POST',
		         success: function(response) {
	                 console.log(response);
	             },
		         error: function(error) {
	                 console.log(error);
	             }
	         });
	     });
	 });
 </script>
 </body>

 </html>